{% extends "layouts/base.volt" %}

{% block title %}{{ get_title() }}{% endblock %}

{% block content %}

{{ partial("layouts/navbar", ['currentPage': 'answer']) }}

{{ partial("layouts/subnavbar", ['currentPage': 'answer/index']) }}

<div class="main">
	
	<div class="main-inner">

	    <div class="container">
	
	      <div class="row">
	      	
	      	<div class="span12">      		
	      		
	      		<div class="widget ">
	      			
	      			<div class="widget-header">
	      				<i class="icon-user"></i>
	      				<h3>题目{{ test['no'] }}({{ finished }}/{{ total }})：{{ test['title'] }}</h3>

	  				</div> <!-- /widget-header -->
					
					<div class="widget-content">
						<div id="alert">
						</div>						
						<form id="edit-profile" class="form-horizontal" action="#" method="post">
							<fieldset>
								<div class="control-group">											
											<label class="control-label" for="question">问题：</label>
											<div class="controls">
												<input type="text" class="span6 disabled" id="username" value="{{ test['question'] }}" disabled="">
											</div> <!-- /controls -->				
										</div>
								<div class="controls">
								  <label>
								    <input type="radio" name="select" id="optionsRadios1" value="1">
								    {{ test['option_1'] }}
								  </label>
								</div>
								<div class="controls">
								  <label>
								    <input type="radio" name="select" id="optionsRadios2" value="2">
								    {{ test['option_2'] }}
								  </label>
								</div>
								<div class="controls">
								  <label>
								    <input type="radio" name="select" id="optionsRadios3" value="3">
								    {{ test['option_3'] }}
								  </label>
								</div>
								<div class="controls">
								  <label>
								    <input type="radio" name="select" id="optionsRadios3" value="4">
								    {{ test['option_4'] }}
								  </label>
								</div>
								
								<div class="form-actions">
								{% if finished == total %}
									<input type="button" id="submit_button" class="btn btn-primary" value="完成"/>
								{% else %}
									<input type="button" id="submit_button" class="btn btn-primary" value="下一题"/>
								{% endif %}
								</div> <!-- /form-actions -->
							</fieldset>
						</form>
						
					</div> <!-- /widget-content -->
						
				</div> <!-- /widget -->
	      		
		    </div> <!-- /span8 -->
	      	
	      	
	      	
	      	
	      </div> <!-- /row -->
	
	    </div> <!-- /container -->
	    
	</div> <!-- /main-inner -->
    
</div> <!-- /main -->

{% endblock %}
{% block js %}
<script>
$(document).ready(function(){
  $("#submit_button").click(function() {
    var select = $('input[name="select"]').filter(':checked').val();

    if(select == undefined){
    	$("#alert").html("<div class='alert'><button type='button' class='close' data-dismiss='alert'>×</button><strong>提示！</strong> 请做出选择。</div>");
    }else{
    	$.post("/answer/submit",
	    {
	      select:select
	    },
	    function(data,status){
	      if(data != "" && data != "error"){
	        top.location = "/answer";
	      }else{
	      	$("#alert").html("<div class='alert'><button type='button' class='close' data-dismiss='alert'>×</button><strong>提示！</strong> 未知错误。如果再次遇到该情况，请联系管理员。</div>");
	      }
	    });
    }
  });
});
$(function(){
  $.get("http://ot.lk-life.com/timer/getEndTime",{id : 1}, function(result){
    var thetime = parseInt(result);
    var timenow = new Date();

    timenow.setSeconds(timenow.getSeconds() + thetime);
    
    $('#clock').countdown(timenow,function(event){
      var timeformat = event.strftime('距离答题结束还有 %D天 %H:%M:%S'); //定义倒计时格式
      $(this).html(timeformat);
    }).on('finish.countdown', function(){ 
      alert("在线测试结束！在此之前的题目已经提交成功！");
      top.location = "/answer";
    });
  });
});
</script>
{% endblock %}